@charset "utf-8";
@import"commom/rest";
@function n($px) {
    @return $px/2;
}
img{
    width: 100%;
}

.da{
   .logoa{
         padding:n(44px) 0 0 n(44px);
       width: n(147px);
      @extend img;
   } 
   .tuoyuan_box{
       position: relative;
       .tuoyuan{
           margin: 0 auto;
           margin-top:n(53px);
           width: n(173px);
           @extend img;
       }
       .tuoyuan_img{
           position: absolute;
           top: n(18px);
           left:n(308px);
           margin: 0 auto;
       width: n(141px);
       height: n(129px);
       @extend img;
       }
       .ceshi{
           text-align: center;
           h4{
               margin-top:n(14px) ;
          font-size: n(30px);
          color: white;
          span{
              color: #fff000;
          }
          }
          h5{
              margin-top: n(27px);
            font-size: n(30px);
            color:white;  
          } 
       }
       .pinjia{
           font-size: n(30px);
           margin-top: n(88px);
           padding-left:n(44px);
           color:#d5d5d5; 
           h3{
               margin-top: n(15px);
           } 
       }
     
   }
   .bottom_middel{
       height: 150px;
       position: relative;

       h5{
           font-size:n(24px);
           padding-top: n(10px);
           padding-left: n(15px);
       }
       .p{
           position: absolute;
           top: n(124px);
           left:n(440px);
           width: n(222px);
           background: #c3c227;
           border-radius:50% ;
           height: n(54px);
           box-shadow: 10px 6px 8px 2px #000000;
           animation:yjj 5s infinite;
             
       }
       @keyframes yjj{
           0%,100%{
               transform: translateX(0) translateY(0);
           }
           50%{
               transform: translateX(9px) translateY(5px);
           }
           
       }
       .o{
            position: absolute;
           top:n(74px);
           left:n(292px);
            width: n(132px);
            background: #a2b25f;
            border-radius:50% ;
           height: n(54px);
            box-shadow: 10px 6px 8px 2px #000000;
           animation:yjj 5s infinite;
           
       }
       .i{
            position: absolute;
           top: n(20px);
           left:n(110px);
            width: n(167px);
          background: #5c727a;
          border-radius:50% ;
           height: n(54px);
            box-shadow: 10px 6px 8px 2px #000000;
           animation:yjj 5s infinite;
       }
       .u{
            position: absolute;
           top:n(6px);
           left:n(461px);
            width: n(167px);
          background: #bcccd9;
          border-radius:50% ;
           height: n(54px);
            box-shadow: 10px 6px 8px 2px #000000;
           animation:yjj 5s infinite;
       }
   }
   .bottom_weibu{
       text-align: center;
       h5{
           font-size: n(21px);
           color: white;
       }
       input{
           background: none;
           margin: 0 auto;
           margin-top: n(19px);  
           width: n(496px);
           height: n(73px);
       }
   }
   .alianjie{
       text-align: center;
       margin-top: n(20px);
//     text-shadow:2px 3px; /*阴影  */
           a{
               text-align: center;
             display: inline-block;
             width:n(180px) ;
             height: n(60px);
             background: #FFF000;
             border-radius:n(23.5px); 
             color: #000000;
             padding-top: n(10px);
             
           }
           
       }
       
   
   
   
}
@media only screen and (max-height:555.5px) {
.da .logoa {
    padding: 14px 0 0 21px;
    width: 66.5px;
}
.da .tuoyuan_box .tuoyuan {
    margin-top: 12.5px;
    width: 83.5px;
    }
    .da .tuoyuan_box .tuoyuan_img {
    left: 126px;
    width: 70.5px;
}
.da .tuoyuan_box .pinjia {
    font-size: 12px;
    margin-top: 11px;
    padding-left: 22px;
}
.da .tuoyuan_box .ceshi h5 {
    margin-top: 6.5px;
    font-size: 12px;
}
.da .tuoyuan_box .ceshi h4 {
    margin-top: 7px;
    font-size: 12px;
}
.da .bottom_middel {
    height: 109px;
}
.da .bottom_middel .i {
    left: 21px;
    width: 63.5px;
    }
    .da .bottom_middel .o {
    left: 96px;
    }
    .da .bottom_middel .p {
    left: 164px;
    width: 103px;
    }
    .da .bottom_middel .u {
    top: 3px;
    left: 186.5px;
    }

}

@media only screen and (min-height:556px) and (max-height:591px) {
    .da .tuoyuan_box .tuoyuan_img {
    left: 127px;
    }
    .da .tuoyuan_box .tuoyuan {
    margin-top: 11.5px;
}
.da .tuoyuan_box .pinjia {
    margin-top: 21px;
    }
    .da .bottom_middel .i {
    left: 21px;
    }
    .da .bottom_middel .o {
    left: 112px;
    }
    .da .bottom_middel .p {
    left: 183px;
    }
    .da .bottom_middel .u {
    left: 205.5px;
    }
    
}
.active .alianjie{
     animation-name: swing;
    animation-delay: 250ms;
}
.active .bottom_weibu{
     animation-name: bounce;
    animation-delay: 250ms;
}
.active .pinjia{
     animation-name: slidenInRight;
    animation-delay: 250ms;
}
